// 加载页面判断cookie，有cookie的话进入用户主页
$(function($) {


    if (getCookie('$flag') == '' && document.cookie != '') {
        let str = decodeURIComponent(document.cookie);
        console.log(str);
        // $('.log_Btn>a').text('')
        let arr = str.split('=');
        let newstr = arr[0].toString();
        $('.top_nav').children('li').eq(0).removeClass('log_Btn').addClass('user1').eq(0).text(newstr);
    }

})


// 登录弹出模态框
$(function($) {
        $('.log_Btn').on('click', function() {
            $('.background_modal').css('display', 'block');


        })
        $('.close_Btn').on('click', function() {
            $('.background_modal').css('display', 'none');
            $('.body_modal').css('display', 'block');
            $('.body_modal1').css('display', 'none');
        })
        $('.cut_Btn').on('click', function() {
            $(this).parent().css('display', 'none');
            $('.body_modal1').css('display', 'block');
        })
        $('.cut_Btn1').on('click', function() {
            $(this).parent().css('display', 'none');
            $('.body_modal').css('display', 'block');
        })
    })
    // js 实现点击手机号登录或邮箱登录实现表单切换
$(function() {
        let flag = true;
        if (flag) {
            $('.email').css('color', '#999')
        }
        $('.email').on('mouseover', function() {
            if (flag) {
                $(this).css('color', "#b4a078");
            }
        })
        $('.email').on('mouseout', function() {
            if (flag) {
                $(this).css('color', "#999");
            }
        })
        $('.email').on('click', function() {
            $(this).css('color', "#333");
            $('.phone_Num').css('color', "#999");
            flag = false;
            // js渲染代码
            $('.modal_Center').css('display', 'none')
            $('.modal_Center1').css('display', 'block')
            $('.email_Register').css('display', 'block')

        })


        $('.phone_Num').on('mouseover', function() {
            if (!flag) {
                $(this).css('color', "#b4a078");
            }
        })
        $('.phone_Num').on('mouseout', function() {
            if (!flag) {
                $(this).css('color', "#999");
            }
        })
        $('.phone_Num').on('click', function() {
                $(this).css('color', "#333");
                $('.email').css('color', "#999");
                flag = true;
                $('.modal_Center').css('display', 'block')
                $('.modal_Center1').css('display', 'none')
                $('.email_Register').css('display', 'none')


            })
            // 点击注册事件
        $('.email_Register').on('click', function() {
            window.open('./register.html');
        })
        let flag1 = true;
        $('.prompt_Message_Text').on('click', function() {
                if (flag1) {

                    $(this).text("短信快捷登录");
                    flag1 = false;
                    $('.slide_Case').css('display', 'none');
                    $('.identifying_Area').css('display', 'none');
                    $('.password_Area').css('display', "flex");
                    $('.login_Btn').text('登录');
                    // $('.body_modal1').css('height', '420px');
                } else {
                    $(this).text('使用密码验证登录');
                    flag1 = true;
                    $('.slide_Case').css('display', 'flex');
                    $('.identifying_Area').css('display', 'flex');
                    $('.password_Area').css('display', "none");
                    $('.login_Btn').text('手机号快捷登录');
                    // $('.body_modal1').css('height', '480px');

                }
            })
            // 表单及时验证

        let timer = null;
        $('.modal_Center input').on('focus', function() {
            timer = setInterval(() => {

                if ($(this).val() !== "") {
                    $(this).next('b').children('i').css("display", "block");
                } else {
                    $(this).next('b').children('i').css("display", "none");
                }
            }, 200);
            $('.modal_Center input').on('blur', function() {
                clearInterval(timer);
            })
        })
        $('.modal_Center1 input').on('focus', function() {
            timer = setInterval(() => {

                if ($(this).val() !== "") {
                    $(this).next('b').children('i').css("display", "block");
                } else {
                    $(this).next('b').children('i').css("display", "none");
                }
            }, 200);
            $('.modal_Center1 input').on('blur', function() {
                clearInterval(timer);
            })
        })

    })
    // 点击清除
$('.clear_Btn').on('click', function() {
        $(this).parent().prev().val('');
        $(this).parent().prev().trigger('focus');
    })
    // 窗口滚动事件
window.onscroll = function() {
        // 左侧导航条
        // console.log(document.documentElement.scrollTop);
        if (document.documentElement.scrollTop > 110) {
            $('.topslide_Nav').css('display', 'block');
        }
        if (document.documentElement.scrollTop < 110) {
            $('.topslide_Nav').css('display', 'none');
        }
        if (document.documentElement.scrollTop > 556) {
            $('.left_nav').css({
                'position': 'fixed',
                'top': '90px',
                'left': '238px'
            });
        }
        if (document.documentElement.scrollTop < 556) {
            $('.left_nav').css({
                'position': 'absolute',
                'top': '-10px',
                'left': '-138px'
            });
        }

    }
    // 人气推荐板块点击事件
$('.h3_1').on('click', function() {

    /* border-bottom: 2px solid #cc9756; */
    $(this).addClass('color_Border');
    $('.h3_2').removeClass('color_Border')
})
$('.h3_2').on('click', function() {
        $('.h3_1').removeClass('color_Border')
        $(this).addClass('color_Border');
    })
    // 登录链接后端接口
$('.login_Btn1').on('click', function() {
    let xhr = new XMLHttpRequest();
    xhr.open("post", "./goodsAndShoppingCart/login.php", true);

    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4 && xhr.status == 200) {
            if (xhr.responseText == 1) {

                document.getElementById("msg").innerHTML = "登录成功";
                saveCookie($('#username').val(), $('#userpass').val(), 1);
                setTimeout(function() {
                    top.location.reload();
                }, 1000)

            } else {
                document.getElementById("msg").innerHTML = "登录失败,用户名或者密码错误";
            }
        }
    }
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

    let str = "username=" + $('#username').val() + "&userpass=" + $('#userpass').val();
    xhr.send(str);

})
$(function($) {
        if (getCookie('$flag') != '') {
            $('.log_Btn').trigger('click');
            removeCookie('$flag');
        }
    })
    // 点击购物车事件
$(function($) {
        $('.cart_Btn').on('click', function() {
            // console.log(document.cookie);
            if (document.cookie == '') {
                top.location.href = "./login.html";


            } else {
                // console.log(2);
                top.location.href = "./gouwuche.html";

            }


        })
    })
    // 鼠标滑过顶部导航时出现二级菜单

$(function($) {
        $('.search_Button>li').eq(0).nextAll().on('mouseover', function() {
            $(this).children('.erJiCD').css('display', 'block');


        })
        $('.search_Button>li').eq(0).nextAll().on('mouseout', function() {
            $('.erJiCD').css('display', 'none');
        })

    })
    // 页面加载完成渲染二级菜单
$(function() {
        //   建立数据对象传参
        var dataObj = {
                "居家生活": {
                    "床品件套": "床品件套",
                    "被枕褥毯": "被枕盖毯,床垫床褥",
                    "办公家具": "办公家具,好物精选",
                    "卧室家具": "卧室家具,灯具,小件家具,北欧原木,浴室用品",
                    "厨房电器": "厨房电器,餐厨爆款清单",
                    "锅具清洁": "品质锅具,餐厨配件,刀剪砧板,餐具,水具杯壶,茶咖酒具,品茗茶具"

                },
                "宠物生活": {
                    "宠物主粮": "猫粮,犬粮",
                    "宠物零食": "宠物罐头,冻干零食"
                }
            }
            // 获取最大数量进行传参，建html结构
        function getKeyNum(obj) {
            let num = 0;
            for (x in obj) {
                num++;
            }
            return num;
        }
        // 写一个获取json对象KEY值的函数，以数组形式返回
        function getkey(obj) {
            let arr = [];
            for (x in obj) {
                console.log(x);
                arr.push(x);
            }
            return arr;
        }
        // 获取对象的value,以二维数组形式返回
        function getvalue(obj) {
            let arr = [];
            for (x in obj) {
                console.log(obj[x]);
                arr.push(obj[x].split(','));

            }
            return arr;
        }
        // 页面渲染
        $('.search_Button>li').eq(0).nextAll().each(function() {

            let topText = $(this).children('a').text();
            // console.log(topText);
            let liNum = getKeyNum(dataObj[topText]);

            let arr = getkey(dataObj[topText]);
            // console.log(arr);
            let erweiArr = getvalue(dataObj[topText]);
            // console.log(erweiArr);
            // console.log(liNum);
            for (let i = 0; i < liNum; i++) {
                $(this).children('.erJiCD').children('ul').append(`<li>${arr[i]}</li>`);
                $(this).children('.erJiCD').children('div').append("<ul></ul>")
            }

            let li = $(this).children('.erJiCD').children('div').children('ul');
            // console.log(li);
            let num = 0;
            li.each(function() {
                let xnum = 0;
                $.each(erweiArr[num], function() {
                    xnum++;
                });

                for (let i = 0; i < xnum; i++) {
                    $(this).append(`<li><div></div><span>${erweiArr[num][i]}</span></li>`)
                }

                num++;
            })
        })
    })
    // 获取购物车数据库数据
$(function($) {
        if (document.cookie != '') {
            let str = decodeURIComponent(document.cookie);
            console.log(str);
            // $('.log_Btn>a').text('')
            let arr = str.split('=');
            let newstr = arr[0].toString();
            $.get("./goodsAndShoppingCart/getShoppingCart.php", { "vipName": `${newstr}` }, function(data) {
                    let goodsdata = JSON.parse(data); //json 数组对象形式
                    console.log(goodsdata);
                    let zongjia = 0;
                    let cart_Tag = 0;
                    for (let key in goodsdata) {
                        cart_Tag++;
                        let $div = $('#goods_box1').clone(true).appendTo($('.cart_body')).css('display', 'block');
                        $div.find('img').attr('src', `${ goodsdata[key]['goodsImg']}`);
                        $div.find('.goods_name1').text(`${ goodsdata[key]['goodsName'].slice(0,8) + '...'}`);
                        $div.find('.goods_price1').text('￥' + `${ goodsdata[key]['goodsPrice']}`);
                        $div.find('.goodsDesc1').text(`${ goodsdata[key]['goodsDesc'].slice(0,8) + '...'}`);
                        $div.find('.goods_num1').text('x' + `${ goodsdata[key]['goodsCount']}`);
                        $div.find('b').attr('index', `${ goodsdata[key]['goodsId']}`);
                        zongjia += goodsdata[key]['goodsPrice'] * goodsdata[key]['goodsCount'];
                    }
                    $('.cart_Tag').text(cart_Tag);
                    $('#zongjia').text('￥' + zongjia);

                })
                // 鼠标滑过购物车,显示商品
            $('.cart_Btn').hover(function() {
                $('.small_cart').css('display', 'block')
            }, function() {
                $('.small_cart').css('display', 'none')
            });

            // 点x删除购物车数据库商品
            $('.goods_info1').find('b').on('click', function() {
                    console.log(321);
                    let $this = $(this);
                    $.get("./goodsAndShoppingCart/deleteGoods.php", { 'vipName': `${newstr}`, 'goodsId': `${$(this).attr('index')}` }, (data) => {
                        if (data == 1) {
                            $('.cart_Tag').text(parseInt($('.cart_Tag').text() - 1));
                            $this.parents('#goods_box1').css('display', 'none');
                            alert('删除成功');


                        } else {
                            alert('删除失败');
                        }
                    });

                })
                // 点击去购物车结算
            $('.goodscart_btn1').on('click', function() {
                top.location.href = "./gouwuche.html";
            })
        }


    })
    // 阻止购物车事件冒泡
$(function() {
        $('.small_cart').on('click', function(e) {
            e.stopPropagation();
        })

    })
    // .stopPropagation();


// 点击购物车商品，跳转到商品详情页面
$(function() {
        $('.goods_name1').on('click', function() {
            console.log(333);
            let $goodsId = $(this).nextAll('b').attr('index');
            $.get("./goodsAndShoppingCart/getGoodsInfo.php", { "goodsId": `${$goodsId}` }, function(data) {
                let gdata = JSON.parse(data);
                console.log(gdata);
                let d = JSON.stringify(gdata);
                let storage = window.localStorage;
                storage.setItem("goodsdata", d);
                top.location.href = "./goodsInfo.html";

            });
            // let gdata = {
            //     goodsId: `${$(this).attr('index')}`,
            //     goodsName: `${$(this).find('#goods_name').children('span').text()}`,
            //     goodsPrice: `${$(this).find('#goods_price').text()}`,
            //     goodsInfo: `${$(this).find('#goods_info').text()}`,
            //     goodsImg: `${$(this).find('img').attr('src')}`
            // }
            // let d = JSON.stringify(gdata);
            // let storage = window.localStorage;
            // storage.setItem("goodsdata", d);
            // top.location.href = "./goodsInfo.html";
        })
    })
    // 轮播图渲染
$(function() {
    $.get("./goodsAndShoppingCart/getGoodsListNew.php", { "count": 12 }, function(data) {
        let goodsdata = JSON.parse(data);
        let num = 0;
        $('.banner_Info01').each(function() {
            $(this).find('img').attr('src', `${goodsdata[num]['goodsImg']}`);
            $(this).find('.img_Bottom').children('span').text(`${goodsdata[num]['goodsName']}`);
            $(this).find('.img_Bottom').children('p').children('span').text(`${goodsdata[num]['goodsPrice']}`);
            num++;
        })
    })
    var mySwiper = new Swiper('.swiper', {
        direction: 'horizontal', // 垂直切换选项
        loop: false, // 循环模式选项
        // 如果需要前进后退按钮
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    })
})